@import './reset.scss';
@import './animate.min.scss';
$mc: #1361ff;
.sheetIndex {
}
input {
  color: #333;
}
.siForm {
  .sf {
    &-inner {
      padding: 0 40rpx;
      padding-bottom: 60rpx;
    }
    &-elem {
      margin-bottom: 30rpx;
    }
    &-label {
      font-size: 32rpx;
      color: $mc;
      font-weight: bold;
      margin-bottom: 20rpx;
      &.required {
        &:before {
          content: '*';
          color: #d80c18;
          margin-right: 15rpx;
        }
      }
    }
    &-labels {
      font-size: 25rpx;
    }
    &-option {
    }
    &-select {
    }
    &-input {
    }
    &-btn {
      width: 465rpx;
      height: 76rpx;
      margin: 0 auto;
      margin-top: 50rpx;
      font-size: 36rpx;
      font-weight: bold;
    }
    &-btns {
      display: flex;
      justify-content: space-between;
      margin-top: 50rpx;
    }
    &-btn1 {
      width: 220rpx;
      flex-shrink: 0;
      height: 76rpx;
      margin: 0 auto;
    }
  }
}
.commonBtn {
  font-size: 32rpx;
  color: #fff;
  padding: 0 20rpx;
  background: #3979d0;
  border-radius: 20rpx;
  margin-left: 20rpx;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sfInput {
  height: 75rpx;
  border-radius: 20rpx;
  background: #fff;
  box-sizing: border-box;
  padding: 0 30rpx;
  input {
    height: 75rpx;
    text-align: center;
    font-size: 32rpx;
  }
}
.sfRadio {
  height: 75rpx;
  border-radius: 20rpx;
  background: #fff;
  box-sizing: border-box;
  padding: 0 30rpx;
  display: flex;
  align-items: center;
  position: relative;
  &:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
  }
}
.sfCode {
  display: flex;
  .sc {
    &-input {
      height: 75rpx;
      border-radius: 20rpx;
      background: #fff;
      box-sizing: border-box;
      padding: 0 30rpx;
      flex-grow: 1;
      input {
        height: 75rpx;
        text-align: center;
        font-size: 32rpx;
      }
    }
    &-btn {
      flex-shrink: 0;
      font-size: 32rpx;
      color: #fff;
      padding: 0 20rpx;
      background: #3979d0;
      border-radius: 20rpx;
      margin-left: 20rpx;
      width: 180rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      &.lock {
        background: #3979d099;
      }
    }
  }
}
.sfSelect {
  display: flex;
  align-items: center;
  position: relative;
  height: 75rpx;
  border-radius: 20rpx;
  background: #fff;
  box-sizing: border-box;
  padding: 0 30rpx;
  &:after {
    content: '';
    position: absolute;
    width: 33rpx;
    height: 15rpx;
    background: url(#{$domain}down.png) 0 0 / 100% 100% no-repeat;
    right: 30rpx;
    top: 50%;
    transform: translatey(-50%);
    pointer-events: none;
  }
  .ss {
    &-text {
      color: #8f8f8f;
      font-size: 32rpx;
      text-align: center;
      flex-grow: 1;
      &.on {
        color: #333;
      }
    }
  }
}
body {
  background: #bde6ff;
}
.commonTheme {
  min-height: 100vh;
  min-width: 750rpx;
  max-width: 1000rpx;
  margin: 0 auto;
  background: #bde6ff url(#{$domain}bg.png) 0 0 / 100% auto no-repeat;
  &:after {
    content: '';
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #bde6ff;
    z-index: -1;
  }
  .ct {
    &-pic {
      //aspect-ratio: 100 / 79.2;
      padding-top: 79.2%;
    }
    &-inner {
    }
  }
}
.sfRadio {
  .u {
    &-radio {
      margin-right: 100rpx !important;
    }
  }
}
.sheetInfo {
  .si {
    &-title {
      height: 78rpx;
      line-height: 78rpx;
      font-size: 42rpx;
      padding-left: 72rpx;
      background: url(#{$domain}arrow.png) 8rpx center / 48rpx 31rpx no-repeat, url(#{$domain}line.png) left bottom / 669rpx 4rpx no-repeat;
      color: #1361ff;
      margin: 0 40rpx;
      margin-bottom: 50rpx;
      font-weight: bold;
    }
  }
}
.sheetForm {
  .si {
    &-inner {
      padding: 0 40rpx;
      padding-bottom: 60rpx;
    }
    &-block {
      &-title {
        width: 702rpx;
        height: 55rpx;
        margin-bottom: 42rpx;
        &.t1 {
          background: url(#{$domain}t1.png) 0 0 / 100% 100% no-repeat;
        }
        &.t2 {
          background: url(#{$domain}t2.png) 0 0 / 100% 100% no-repeat;
        }
        &.t3 {
          background: url(#{$domain}t3.png) 0 0 / 100% 100% no-repeat;
        }
        &.t4 {
          background: url(#{$domain}t4.png) 0 0 / 100% 100% no-repeat;
        }
      }
      margin-bottom: 66rpx;
    }
    &-btn {
      height: 76rpx;
      width: 465rpx;
      margin: 0 auto;
      margin-top: 50rpx;
    }
  }
  .sf {
    &-elem {
      &:last-child {
        margin-bottom: 0;
      }
    }
    &-input {
      input {
        text-align: right;
      }
    }
  }
}
.uiSelect {
  .us {
    &-header {
      display: flex;
      justify-content: space-between;
    }
    &-picker {
      &-item {
        text-align: center;
        line-height: 34px;
      }
    }
    &-search {
      padding: 0 30rpx;
    }
    &-btn {
      height: 100rpx;
      line-height: 100rpx;
      width: 120rpx;
      text-align: center;
      font-weight: bold;
      font-size: 32rpx;
      &.b1 {
        color: $mc;
      }
      &.b2 {
        color: #333;
      }
    }
  }
}
.uni-input-placeholder {
  color: #8f8f8f;
}
